html{
	background-color: #fff;
}
/*banner*/
.banner-cont{
	width: 100%;
	position: relative;
}



.banner-cont .loading-cont.active{
	display: none;
}
.banner-cont .loading-cont{
	width: 100%;
	height: 100%;
	background-color: #fff;
	position: relative;
	overflow: hidden;
}
.banner-cont .loading-cont .loading{
	display: none;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.banner-cont .loading-cont .loading.active{
	display: block;

}
.banner-cont .loading-cont .aloading img{
	width: 400px;
	position: absolute;
	top: 50%;
	left: calc(50% - 200px);
}
.banner-cont .loading-cont .a-loading-1{
	animation: aloading1 .3s forwards;
	-moz-animation: aloading1 .3s forwards;
	-webkit-animation: aloading1 .3s forwards;
	-o-animation: aloading1 .3s forwards;
}
@keyframes aloading1
{
	0% {opacity: 0;transform:translateX(0)}
	10% {opacity: .1;transform:translateX(0)}
	20% {opacity: .2;transform:translateX(0)}
	30% {opacity: .3;transform:translateX(0)}
	40% {opacity: .4;transform:translateX(0)}
	50% {opacity: .5;transform:translateX(0)}
	60% {opacity: .5;transform:translateX(0)}
	70% {opacity: .6;transform:translateX(0)}
	80% {opacity: .7;transform:translateX(0)}
	90% {opacity: .9;transform:translateX(0)}
	100% {opacity: 1;transform:translateX(64px)}
}

@-moz-keyframes aloading1
{
	0% {opacity: 0;transform:translateX(0)}
	10% {opacity: .1;transform:translateX(0)}
	20% {opacity: .2;transform:translateX(0)}
	30% {opacity: .3;transform:translateX(0)}
	40% {opacity: .4;transform:translateX(0)}
	50% {opacity: .5;transform:translateX(0)}
	60% {opacity: .5;transform:translateX(0)}
	70% {opacity: .6;transform:translateX(0)}
	80% {opacity: .7;transform:translateX(0)}
	90% {opacity: .9;transform:translateX(0)}
	100% {opacity: 1;transform:translateX(64px)}
}

@-webkit-keyframes aloading1
{
	0% {opacity: 0;transform:translateX(0)}
	10% {opacity: .1;transform:translateX(0)}
	20% {opacity: .2;transform:translateX(0)}
	30% {opacity: .3;transform:translateX(0)}
	40% {opacity: .4;transform:translateX(0)}
	50% {opacity: .5;transform:translateX(0)}
	60% {opacity: .5;transform:translateX(0)}
	70% {opacity: .6;transform:translateX(0)}
	80% {opacity: .7;transform:translateX(0)}
	90% {opacity: .9;transform:translateX(0)}
	100% {opacity: 1;transform:translateX(64px)}
}

@-o-keyframes aloading1
{
	0% {opacity: 0;transform:translateX(0)}
	10% {opacity: .1;transform:translateX(0)}
	20% {opacity: .2;transform:translateX(0)}
	30% {opacity: .3;transform:translateX(0)}
	40% {opacity: .4;transform:translateX(0)}
	50% {opacity: .5;transform:translateX(0)}
	60% {opacity: .5;transform:translateX(0)}
	70% {opacity: .6;transform:translateX(0)}
	80% {opacity: .7;transform:translateX(0)}
	90% {opacity: .9;transform:translateX(0)}
	100% {opacity: 1;transform:translateX(64px)}
}
.banner-cont .loading-cont .a-loading-2{
	clip: rect(0px 0px 87.14px 0px);
	animation: aloading2 .2s .3s forwards;
	-moz-animation: aloading2 .2s .3s forwards;
	-webkit-animation: aloading2 .2s .3s forwards;
	-o-animation: aloading2 .2s .3s forwards;
}
@keyframes aloading2
{
	0% {clip: rect(0px 0px 87.14px 0px);}
	10% {clip: rect(0px 40px 87.14px 0px);}
	20% {clip: rect(0px 80px 87.14px 0px);}
	30% {clip: rect(0px 120px 87.14px 0px);}
	40% {clip: rect(0px 160px 87.14px 0px);}
	50% {clip: rect(0px 200px 87.14px 0px);}
	60% {clip: rect(0px 240px 87.14px 0px);}
	70% {clip: rect(0px 280px 87.14px 0px);}
	80% {clip: rect(0px 320px 87.14px 0px);}
	90% {clip: rect(0px 360px 87.14px 0px);}
	100% {clip: rect(0px 400px 87.14px 0px);}
}

@-moz-keyframes aloading2
{
	0% {clip: rect(0px 0px 87.14px 0px);}
	10% {clip: rect(0px 40px 87.14px 0px);}
	20% {clip: rect(0px 80px 87.14px 0px);}
	30% {clip: rect(0px 120px 87.14px 0px);}
	40% {clip: rect(0px 160px 87.14px 0px);}
	50% {clip: rect(0px 200px 87.14px 0px);}
	60% {clip: rect(0px 240px 87.14px 0px);}
	70% {clip: rect(0px 280px 87.14px 0px);}
	80% {clip: rect(0px 320px 87.14px 0px);}
	90% {clip: rect(0px 360px 87.14px 0px);}
	100% {clip: rect(0px 400px 87.14px 0px);}
}

@-webkit-keyframes aloading2
{
	0% {clip: rect(0px 0px 87.14px 0px);}
	10% {clip: rect(0px 40px 87.14px 0px);}
	20% {clip: rect(0px 80px 87.14px 0px);}
	30% {clip: rect(0px 120px 87.14px 0px);}
	40% {clip: rect(0px 160px 87.14px 0px);}
	50% {clip: rect(0px 200px 87.14px 0px);}
	60% {clip: rect(0px 240px 87.14px 0px);}
	70% {clip: rect(0px 280px 87.14px 0px);}
	80% {clip: rect(0px 320px 87.14px 0px);}
	90% {clip: rect(0px 360px 87.14px 0px);}
	100% {clip: rect(0px 400px 87.14px 0px);}
}

@-o-keyframes aloading2
{
	0% {clip: rect(0px 0px 87.14px 0px);}
	10% {clip: rect(0px 40px 87.14px 0px);}
	20% {clip: rect(0px 80px 87.14px 0px);}
	30% {clip: rect(0px 120px 87.14px 0px);}
	40% {clip: rect(0px 160px 87.14px 0px);}
	50% {clip: rect(0px 200px 87.14px 0px);}
	60% {clip: rect(0px 240px 87.14px 0px);}
	70% {clip: rect(0px 280px 87.14px 0px);}
	80% {clip: rect(0px 320px 87.14px 0px);}
	90% {clip: rect(0px 360px 87.14px 0px);}
	100% {clip: rect(0px 400px 87.14px 0px);}
}
.banner-cont .loading-cont .a-loading-3{
	opacity: 0;
	animation: aloading3 .5s .5s forwards;
	-moz-animation: aloading3 .5s .5s forwards;
	-webkit-animation: aloading3 .5s .5s forwards;
	-o-animation: aloading3 .5s .5s forwards;
}
@keyframes aloading3
{
	0% {opacity: 0}
	/*10% {opacity: .1}
	20% {opacity: .2}
	30% {opacity: .3}
	40% {opacity: .4}
	50% {opacity: .5}
	60% {opacity: .5}
	70% {opacity: .6}
	80% {opacity: .7}
	90% {opacity: .9}*/
	100% {opacity: 1}
}
@-moz-keyframes aloading3
{
	0% {opacity: 0}
	/*10% {opacity: .1}
	20% {opacity: .2}
	30% {opacity: .3}
	40% {opacity: .4}
	50% {opacity: .5}
	60% {opacity: .5}
	70% {opacity: .6}
	80% {opacity: .7}
	90% {opacity: .9}*/
	100% {opacity: 1}
}

@-webkit-keyframes aloading3
{
	0% {opacity: 0}
	/*10% {opacity: .1}
	20% {opacity: .2}
	30% {opacity: .3}
	40% {opacity: .4}
	50% {opacity: .5}
	60% {opacity: .5}
	70% {opacity: .6}
	80% {opacity: .7}
	90% {opacity: .9}*/
	100% {opacity: 1}
}

@-o-keyframes aloading3
{
	0% {opacity: 0}
	/*10% {opacity: .1}
	20% {opacity: .2}
	30% {opacity: .3}
	40% {opacity: .4}
	50% {opacity: .5}
	60% {opacity: .5}
	70% {opacity: .6}
	80% {opacity: .7}
	90% {opacity: .9}*/
	100% {opacity: 1}
}
.banner-cont .loading-cont .a-loading-text{
	color: rgb(121, 35, 44);
	font-size: 16px;
	font-weight: 700;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: scale(0,0);
	animation: aloadingText .2s 1s forwards;
	-moz-animation: aloadingText .2s 1s forwards;
	-webkit-animation: aloadingText .2s 1s forwards;
	-o-animation: aloadingText .2s 1s forwards;
}
@keyframes aloadingText
{
	0% {transform: translate(0,-50px) scale(20,20); transform-origin: center center; }
	100% {transform: translate(0,200px) scale(150,150); transform-origin: center center;}
}
@-moz-keyframes aloadingText
{
	0% {transform: translate(0,-50px) scale(20,20); transform-origin: center center; }
	100% {transform: translate(0,200px) scale(150,150); transform-origin: center center;}
}

@-webkit-keyframes aloadingText
{
	0% {transform: translate(0,-50px) scale(20,20); transform-origin: center center; }
	100% {transform: translate(0,200px) scale(150,150); transform-origin: center center;}
}

@-o-keyframes aloadingText
{
	0% {transform: translate(0,-50px) scale(20,20); transform-origin: center center; }
	100% {transform: translate(0,200px) scale(150,150); transform-origin: center center;}
}
.banner-cont .loading-cont .rLoading .r-loading{
	height: 193.875%;
	position: absolute;
	top: 0;
	left: 0;
	animation: rloading 1s .3s forwards;
	-moz-animation: rloading 1s .3s forwards;
	-webkit-animation: rloading 1s .3s forwards;
	-o-animation: rloading 1s .3s forwards;
}
@keyframes rloading
{
	0% {opacity: 1;transform: rotate(-30deg) scale(.5);transform-origin: top left;}
	100% {opacity: 1;transform: rotate(-0deg) scale(1);transform-origin: top left;}
}
@-moz-keyframes rloading
{
	0% {opacity: 1;transform: rotate(-30deg) scale(.5);transform-origin: top left;}
	100% {opacity: 1;transform: rotate(-0deg) scale(1);transform-origin: top left;}
}

@-webkit-keyframes rloading
{
	0% {opacity: 1;transform: rotate(-30deg) scale(.5);transform-origin: top left;}
	100% {opacity: 1;transform: rotate(-0deg) scale(1);transform-origin: top left;}
}

@-o-keyframes rloading
{
	0% {opacity: 1;transform: rotate(-30deg) scale(.5);transform-origin: top left;}
	100% {opacity: 1;transform: rotate(-0deg) scale(1);transform-origin: top left;}
}

.banner-cont .loading-cont .cLoading .c-loading{
	height: 176.125%;
	position: absolute;
	bottom: 0;
	left: -50px;
	transform: scale(0);
	animation: cloading 1s .3s forwards;
	-moz-animation: cloading 1s .3s forwards;
	-webkit-animation: cloading 1s .3s forwards;
	-o-animation: cloading 1s .3s forwards;
}
@keyframes cloading
{
	0% {opacity: .3;transform: scale(.5) translate(50%,20%);transform-origin: top center;}
	100% {opacity: 1;transform: scale(1) translate(0,0);transform-origin: top center;}
}
@-moz-keyframes cloading
{
	0% {opacity: .3;transform: scale(.5) translate(50%,20%);transform-origin: top center;}
	100% {opacity: 1;transform: scale(1) translate(0,0);transform-origin: top center;}
}

@-webkit-keyframes cloading
{
	0% {opacity: .3;transform: scale(.5) translate(50%,20%);transform-origin: top center;}
	100% {opacity: 1;transform: scale(1) translate(0,0);transform-origin: top center;}
}

@-o-keyframes cloading
{
	0% {opacity: .3;transform: scale(.5) translate(50%,20%);transform-origin: top center;}
	100% {opacity: 1;transform: scale(1) translate(0,0);transform-origin: top center;}
}
.banner-cont .loading-cont .sLoading .s-loading{
	height: 203.375%;
	position: absolute;
	bottom: 0;
	left: 0;
	transform: scale(0);
	animation: sloading 1s .3s forwards;
	-moz-animation: sloading 1s .3s forwards;
	-webkit-animation: sloading 1s .3s forwards;
	-o-animation: sloading 1s .3s forwards;
}
@keyframes sloading
{
	0% {opacity: .1;transform: scale(.5) translate(50%,20%);transform-origin: top center;}
	100% {opacity: 1;transform: scale(1) translate(0,0);transform-origin: top center;}
}
@-moz-keyframes sloading
{
	0% {opacity: .1;transform: scale(.5) translate(50%,20%);transform-origin: top center;}
	100% {opacity: 1;transform: scale(1) translate(0,0);transform-origin: top center;}
}

@-webkit-keyframes sloading
{
	0% {opacity: .1;transform: scale(.5) translate(50%,20%);transform-origin: top center;}
	100% {opacity: 1;transform: scale(1) translate(0,0);transform-origin: top center;}
}

@-o-keyframes sloading
{
	0% {opacity: .1;transform: scale(.5) translate(50%,20%);transform-origin: top center;}
	100% {opacity: 1;transform: scale(1) translate(0,0);transform-origin: top center;}
}





















.banner-cont .banner-container{
	display: none;
	font-size: 0;
	height: 100%;
}
.banner-cont .banner-container.active{
	display: block;
}
.banner-cont .banner-container .banner{
	display: none;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.banner-cont .banner-container .banner.active{
	display: block;
}
.banner-cont .banner-container .banner.a{
	position: relative;
	overflow: hidden;
	font-size: 0;
	background-color: #fff;
}
.banner-cont .banner-container .banner.a .a-left{
	background-color: #7a242f;
	/*height: calc(100% - 1px);*/
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
.banner-cont .banner-container .banner.a .a-left .animation{
	height: 100%;
	animation: a 1s;
	-moz-animation: a 1s;
	-webkit-animation: a 1s;
	-o-animation: a 1s;
}
@keyframes a
{
	from {transform:translate(100px,100px)}
	to {transform:translate(0,0)}
}

@-moz-keyframes a
{
	from {transform:translate(100px,100px)}
	to {transform:translate(0,0)}
}

@-webkit-keyframes a
{
	from {transform:translate(100px,100px)}
	to {transform:translate(0,0)}
}

@-o-keyframes a
{
	from {transform:translate(100px,100px)}
	to {transform:translate(0,0)}
}
.banner-cont .banner-container .banner.a .a-right{
	position: absolute;
	z-index: 9;
	top: 0;
	left: 30%;
	width: 100%;
	height: 101%;
	background-color: #fff;
	transform: skewX(-15deg);
	-ms-transform: skewX(-15deg);
	-webkit-transform: skewX(-15deg);
	-o-transform: skewX(-15deg);
	-moz-transform: skewX(-15deg);
}
.banner-cont .banner-container .banner.a .a-right .a-text-cont{
	transform: skewX(15deg);
	-ms-transform: skewX(15deg);
	-webkit-transform: skewX(15deg);
	-o-transform: skewX(15deg);
	-moz-transform: skewX(15deg);
	height: 100%;
}
.a-1-cont{
	position: absolute;
	top: 120px;
	left: 100px;
	width: 100%;
}
.a-2-cont{
	position: absolute;
	bottom: 60px;
	left: 0;
	font-size: 0;
}
.a-1-cont .title{
	font-size: 30px;
	color: #79232c;
	font-weight: 900;
	line-height: 80px;
	margin-top: 40px;
}
.a-1-cont .text{
	font-size: 14px;
	color: #666;
	line-height: 30px;
	width: 40%;
}
.a-2-cont .title{
	font-size: 34px;
	color: #000;
	font-weight: 300;
	line-height: 104px;
}


/*r*/
.r-left{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
}
.r-left img{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
}
.r-left .r-img{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9;
	height: 100%;
	/*opacity: 0;
	animation: rImg 1s forwards;
	-moz-animation: rImg 1s forwards;
	-webkit-animation: rImg 1s forwards;
	-o-animation: rImg 1s forwards;*/
}
@keyframes rImg
{
	from {opacity: 0;}
	to {opacity: 1;}
}
@-moz-keyframes rImg
{
	from {opacity: 0;}
	to {opacity: 1;}
}

@-webkit-keyframes rImg
{
	from {opacity: 0;}
	to {opacity: 1;}
}

@-o-keyframes rImg
{
	from {opacity: 0;}
	to {opacity: 1;}
}
.r-left .r-animation-1{
	z-index: 99;
	animation: r1 1s forwards;
	-moz-animation: r1 1s forwards;
	-webkit-animation: r1 1s forwards;
	-o-animation: r1 1s forwards;
}
@keyframes r1
{
	from {transform: translate(0,0);opacity: 1;}
	to {transform: translate(-90px,90px);opacity: 0;}
}
@-moz-keyframes r1
{
	from {transform: translate(0,0);opacity: 1;}
	to {transform: translate(-90px,90px);opacity: 0;}
}

@-webkit-keyframes r1
{
	from {transform: translate(0,0);opacity: 1;}
	to {transform: translate(-90px,90px);opacity: 0;}
}

@-o-keyframes r1
{
	from {transform: translate(0,0);opacity: 1;}
	to {transform: translate(-90px,90px);opacity: 0;}
}
.r-left .r-animation-2{
	z-index: 99;
	opacity: 0;
	animation: r2 1s .5s forwards;
	-moz-animation: r2 1s .5s forwards;
	-webkit-animation:  r2 1s .5s forwards;
	-o-animation:  r2 1s .5s forwards;
}
@keyframes r2
{
	from {opacity: 0;}
	to {opacity: 1;}
}
@-moz-keyframes r2
{
	from {opacity: 0;}
	to {opacity: 1;}
}

@-webkit-keyframes r2
{
	from {opacity: 0;}
	to {opacity: 1;}
}

@-o-keyframes r2
{
	from {opacity: 0;}
	to {opacity: 1;}
}
.r-left .r-animation-3{
	z-index: 99;
	animation: r3 1s forwards;
	-moz-animation: r3 1s forwards;
	-webkit-animation: r3 1s forwards;
	-o-animation:  r3 1s forwards;
}
@keyframes r3
{
	from {transform: translate(0,0);opacity: 1;}
	to {transform: translate(90px,-90px);opacity: 0;}
}
@-moz-keyframes r3
{
	from {transform: translate(0,0);opacity: 1;}
	to {transform: translate(90px,-90px);opacity: 0;}
}

@-webkit-keyframes r3
{
	from {transform: translate(0,0);opacity: 1;}
	to {transform: translate(90px,-90px);opacity: 0;}
}

@-o-keyframes r3
{
	from {transform: translate(0,0);opacity: 1;}
	to {transform: translate(90px,-90px);opacity: 0;}
}
.r-right{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	z-index: 99;
}
.r-right .r-right-bg{
	height: 100%;
}

.r-right .r-1-cont{
	position: absolute;
	top: 53.5%;
	left: 27.6%;
}
.r-right .r-1-cont img{
	margin-left: 30px;
}
.r-right .r-1-cont .title{
	font-size: 36px;
	font-weight: 700;
	color: #79242f;
	margin-top: 60px;
	margin-bottom: 30px;
}
.r-right .r-1-cont .text{
	display: block;
	width: 36%;
	font-size: 14px;
	color: #666;
	line-height: 30px;
}
.r-right .r-2-cont{
	position: absolute;
	top: 20%;
	left: 54.5%;
}
.r-right .r-2-cont .title{
	font-size: 34px;
	color: #000;
	font-weight: 300;
	line-height: 104px;
}
.c-left{
	position: absolute;
	bottom: 0;
	left: 0;
	height: 100%;
	width: 100%;
}
.c-left .c-img{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9;
	height: 100%;
}
.c-left .c-animation-1{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 999;
	height: 100%;
	transform:translateY(100%);
	animation: c 1s forwards;
	-moz-animation: c 1s forwards;
	-webkit-animation: c 1s forwards;
	-o-animation: c 1s forwards;
}
.c-left .c-animation-2{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99;
	height: 100%;
	transform:translateY(100%);
	animation: c 1s .3s forwards;
	-moz-animation: c 1s .3s forwards;
	-webkit-animation: c 1s .3s forwards;
	-o-animation: c 1s .3s forwards;
}
.c-left .c-animation-3{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99;
	height: 100%;
	transform:translateY(100%);
	animation: c 1s .6s forwards;
	-moz-animation: c 1s .6s forwards;
	-webkit-animation: c 1s .6s forwards;
	-o-animation: c 1s .6s forwards;
}
@keyframes c
{
	from {transform:translateY(100px);opacity: 0;}
	to {transform:translateY(0);opacity: 1;}
}
@-moz-keyframes c
{
	from {transform:translateY(100px);opacity: 0;}
	to {transform:translateY(0);opacity: 1;}
}

@-webkit-keyframes c
{
	from {transform:translateY(100px);opacity: 0;}
	to {transform:translateY(0);opacity: 1;}
}

@-o-keyframes c
{
	from {transform:translateY(100px);opacity: 0;}
	to {transform:translateY(0);opacity: 1;}
}
.c-right{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.c-right .c-1-cont{
	position: absolute;
	left: 28.9%;
	top: 15%;
	z-index: 999;
}
.c-right .c-1-cont img{
	position: absolute;
	top: 0;
	left: -120px;
}
.c-right .c-1-cont .title{
	font-size: 36px;
	font-weight: 700;
	color: #79242f;
	margin-bottom: 30px;
}
.c-right .c-1-cont .text{
	display: block;
	width: 36%;
	font-size: 14px;
	color: #666;
	line-height: 30px;
}
.c-right .c-2-cont{
	position: absolute;
	left: 63%;
	top: 70%;
	z-index: 999;
}
.c-right .c-2-cont .title{
	font-size: 24px;
	color: #000;
	font-weight: 300;
	line-height: 80px;
}
.c-right .c-right-bg{
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 999;
	height: 100%;
}





/*s*/
.s-left{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
}
.s-left .s-img{
	z-index: 9;
}
.s-left img{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	z-index: 99;
}

.s-left .s-animation-1{
	z-index: 999;
	transform-style: preserve-3d;
	transform: rotate3d(1,1,.3,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s1 1s linear forwards;
	-moz-animation: s1 1s linear forwards;
	-webkit-animation: s1 1s linear forwards;
	-o-animation: s1 1s linear forwards;

}
@keyframes s1
{
	from {transform: rotate3d(1,1,.3,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s1
{
	from {transform: rotate3d(1,1,.3,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s1
{
	from {transform: rotate3d(1,1,.3,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s1
{
	from {transform: rotate3d(1,1,.3,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-2{
	z-index: 999;
	transform-style: preserve-3d;
	transform: rotate3d(5,20,.8,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s2 1s .3s linear forwards;
	-moz-animation: s2 1s .3s linear forwards;
	-webkit-animation: s2 1s .3s linear forwards;
	-o-animation: s2 1s .3s linear forwards;
}
@keyframes s2
{
	from {transform: rotate3d(5,20,.8,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s2
{
	from {transform: rotate3d(5,20,.8,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s2
{
	from {transform: rotate3d(5,20,.8,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s2
{
	from {transform: rotate3d(5,20,.8,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-3{
	z-index: 999;
	transform-style: preserve-3d;
	transform: rotate3d(10,15,.9,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s3 1s .6s linear forwards;
	-moz-animation: s3 1s .6s linear forwards;
	-webkit-animation: s3 1s .6s linear forwards;
	-o-animation: s3 1s .6s linear forwards;
}
@keyframes s3
{
	from {transform: rotate3d(10,15,.9,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s3
{
	from {transform: rotate3d(10,15,.9,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s3
{
	from {transform: rotate3d(10,15,.9,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s3
{
	from {transform: rotate3d(10,15,.9,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-4{
	z-index: 999;
	transform-style: preserve-3d;
	transform: rotate3d(10,30,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s4 1s .9s linear forwards;
	-moz-animation: s4 1s .9s linear forwards;
	-webkit-animation: s4 1s .9s linear forwards;
	-o-animation: s4 1s .9s linear forwards;
}
@keyframes s4
{
	from {transform: rotate3d(10,30,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s4
{
	from {transform: rotate3d(10,30,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s4
{
	from {transform: rotate3d(10,30,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s4
{
	from {transform: rotate3d(10,30,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-5{
	z-index: 991;
	transform-style: preserve-3d;
	transform: rotate3d(10,90,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s5 1s 1.2s linear forwards;
	-moz-animation: s5 1s 1.2s linear forwards;
	-webkit-animation: s5 1s 1.2s linear forwards;
	-o-animation: s5 1s 1.2s linear forwards;
}
@keyframes s5
{
	from {transform: rotate3d(10,90,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s5
{
	from {transform: rotate3d(10,90,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s5
{
	from {transform: rotate3d(10,90,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s5
{
	from {transform: rotate3d(10,90,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-6{
	z-index: 999;
	transform-style: preserve-3d;
	transform: rotate3d(-2,-60,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s6 1s 1.5s linear forwards;
	-moz-animation: s6 1s 1.5s linear forwards;
	-webkit-animation: s6 1s 1.5s linear forwards;
	-o-animation: s6 1s 1.5s linear forwards;
}
@keyframes s6
{
	from {transform: rotate3d(-2,-60,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s6
{
	from {transform: rotate3d(-2,-60,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s6
{
	from {transform: rotate3d(-2,-60,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s6
{
	from {transform: rotate3d(-2,-60,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-7{
	z-index: 999;
	transform-style: preserve-3d;
	transform: rotate3d(50,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s7 1s 1.8s linear forwards;
	-moz-animation: s7 1s 1.8s linear forwards;
	-webkit-animation: s7 1s 1.8s linear forwards;
	-o-animation: s7 1s 1.8s linear forwards;
}
@keyframes s7
{
	from {transform: rotate3d(50,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s7
{
	from {transform: rotate3d(50,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s7
{
	from {transform: rotate3d(50,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s7
{
	from {transform: rotate3d(50,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-8{
	z-index: 998;
	transform-style: preserve-3d;
	transform: rotate3d(300,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s8 1s 2.1s linear forwards;
	-moz-animation: s8 1s 2.1s linear forwards;
	-webkit-animation: s8 1s 2.1s linear forwards;
	-o-animation: s8 1s 2.1s linear forwards;
}
@keyframes s8
{
	from {transform: rotate3d(300,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s8
{
	from {transform: rotate3d(300,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s8
{
	from {transform: rotate3d(300,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s8
{
	from {transform: rotate3d(300,-200,-2,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-9{
	z-index: 999;
	transform-style: preserve-3d;
	transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s9 1s 2.4s linear forwards;
	-moz-animation: s9 1s 2.4s linear forwards;
	-webkit-animation: s9 1s 2.4s linear forwards;
	-o-animation: s9 1s 2.4s linear forwards;
}
@keyframes s9
{
	from {transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s9
{
	from {transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s9
{
	from {transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s9
{
	from {transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-10{
	z-index: 998;
	transform-style: preserve-3d;
	transform: rotate3d(35000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s10 1s 2.7s linear forwards;
	-moz-animation: s10 1s 2.7s linear forwards;
	-webkit-animation: s10 1s 2.7s linear forwards;
	-o-animation: s10 1s 2.7s linear forwards;
}
@keyframes s10
{
	from {transform: rotate3d(35000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s10
{
	from {transform: rotate3d(35000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s10
{
	from {transform: rotate3d(35000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s10
{
	from {transform: rotate3d(35000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-11{
	z-index: 999;
	transform-style: preserve-3d;
	transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s11 1s 3s linear forwards;
	-moz-animation: s11 1s 3s linear forwards;
	-webkit-animation: s11 1s 3s linear forwards;
	-o-animation: s11 1s 3s linear forwards;
}
@keyframes s11
{
	from {transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s11
{
	from {transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s11
{
	from {transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-o-keyframes s11
{
	from {transform: rotate3d(20000,-20000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-12{
	z-index: 999;
	transform-style: preserve-3d;
	transform: rotate3d(30000,-50000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;
	animation: s12 1s 3.3s linear forwards;
	-moz-animation: s12 1s 3.3s linear forwards;
	-webkit-animation: s12 1s 3.3s linear forwards;
	-o-animation: s12 1s 3.3s linear forwards;
}
@keyframes s12
{
	from {transform: rotate3d(30000,-50000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
@-moz-keyframes s12
{
	from {transform: rotate3d(30000,-50000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-webkit-keyframes s12
{
	from {transform: rotate3d(30000,-50000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}

@-o-keyframes s12
{
	from {transform: rotate3d(30000,-50000,1,90deg) translateZ(1.5vw);transform-origin:30% 40%;}
	to {transform: rotate3d(0,0,0,0deg) translateZ(0);transform-origin:30% 40%;}
}
.s-left .s-animation-13{
	z-index: 98;
	animation: s13 10s linear forwards;
	-moz-animation: s13 10s linear forwards;
	-webkit-animation: s13 10s linear forwards;
	-o-animation: s13 10s linear forwards;
}
@keyframes s13
{
	from {transform:rotate(0deg);opacity:0;transform-origin:32.6% 40.8%;}
	to {transform:rotate(30deg);opacity:1;transform-origin:32.6% 40.8%;}
}
@-moz-keyframes s13
{
	from {transform:rotate(0deg);opacity:0;transform-origin:32.6% 40.8%;}
	to {transform:rotate(30deg);opacity:1;transform-origin:32.6% 40.8%;}
}

@-webkit-keyframes s13
{
	from {transform:rotate(0deg);opacity:0;transform-origin:32.6% 40.8%;}
	to {transform:rotate(30deg);opacity:1;transform-origin:32.6% 40.8%;}
}

@-o-keyframes s13
{
	from {transform:rotate(0deg);opacity:0;transform-origin:32.6% 40.8%;}
	to {transform:rotate(30deg);opacity:1;transform-origin:32.6% 40.8%;}
}
.s-left .s-animation-14{
	z-index: 98;
	animation: s14 10s linear  forwards;
	-moz-animation: s14 10s linear  forwards;
	-webkit-animation: s14 10s linear  forwards;
	-o-animation: s14 10s linear  forwards;
}
@keyframes s14
{
	from {transform:rotate(0deg);opacity:0;transform-origin:36.4% 35.25%;}
	to {transform:rotate(30deg);opacity:1;transform-origin:36.4% 35.25%;}
}

@-moz-keyframes s14
{
	from {transform:rotate(0deg);opacity:0;transform-origin:36.4% 35.25%;}
	to {transform:rotate(30deg);opacity:1;transform-origin:36.4% 35.25%;}
}

@-webkit-keyframes s14
{
	from {transform:rotate(0deg);opacity:0;transform-origin:36.4% 35.25%;}
	to {transform:rotate(30deg);opacity:1;transform-origin:36.4% 35.25%;}
}

@-o-keyframes s14
{
	from {transform:rotate(0deg);opacity:0;transform-origin:36.4% 35.25%;}
	to {transform:rotate(30deg);opacity:1;transform-origin:36.4% 35.25%;}
}
.s-right{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.s-right .s-right-bg{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 999;
	height: 100%;
}
.s-right .s-1-cont{
	position: absolute;
	left: 17.7%;
	top: 15%;
	z-index: 999;
}
.s-right .s-1-cont .title{
	font-size: 36px;
	font-weight: 700;
	color: #79242f;
	margin-top: 50px;
	margin-bottom: 30px;
}
.s-right .s-1-cont .text{
	display: block;
	width: 35%;
	font-size: 14px;
	color: #666;
	line-height: 30px;
}
.s-right .s-2-cont{
	position: absolute;
	left: 56.25%;
	top: 82.5%;
	z-index: 999;
}
.s-right .s-2-cont .title{
	font-size: 24px;
	color: #000;
	font-weight: 300;
	line-height: 80px;
}













.banner-nav-cont{
	position: absolute;
	z-index: 9999;
	top: 0;
	height: 100%;
	width: 24%;
	right: 0;
	display: none;
}
.banner-nav-cont.active{
	display: block;
	overflow: hidden;

}

.banner-nav-cont .banner-bg{
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.banner-nav-cont .banner-bg-1{
	animation: bannerBg1 10s linear infinite alternate;
	-moz-animation: bannerBg1 10s linear infinite alternate;
	-webkit-animation: bannerBg1 10s linear infinite alternate;
	-o-animation: bannerBg1 10s linear infinite alternate;
}
@keyframes bannerBg1
{
	0% {opacity: 1}
	10% {opacity: .9}
	20% {opacity: .8}
	30% {opacity: .7}
	40% {opacity: .6}
	50% {opacity: .5}
	60% {opacity: .4}
	70% {opacity: .3}
	80% {opacity: .2}
	90% {opacity: .1}
	100% {opacity: 0}
}

@-moz-keyframes bannerBg1
{
	0% {opacity: 1}
	10% {opacity: .9}
	20% {opacity: .8}
	30% {opacity: .7}
	40% {opacity: .6}
	50% {opacity: .5}
	60% {opacity: .4}
	70% {opacity: .3}
	80% {opacity: .2}
	90% {opacity: .1}
	100% {opacity: 0}
}

@-webkit-keyframes bannerBg1
{
	0% {opacity: 1}
	10% {opacity: .9}
	20% {opacity: .8}
	30% {opacity: .7}
	40% {opacity: .6}
	50% {opacity: .5}
	60% {opacity: .4}
	70% {opacity: .3}
	80% {opacity: .2}
	90% {opacity: .1}
	100% {opacity: 0}
}

@-o-keyframes bannerBg1
{
	0% {opacity: 1}
	10% {opacity: .9}
	20% {opacity: .8}
	30% {opacity: .7}
	40% {opacity: .6}
	50% {opacity: .5}
	60% {opacity: .4}
	70% {opacity: .3}
	80% {opacity: .2}
	90% {opacity: .1}
	100% {opacity: 0}
}

.banner-nav-cont ul{
	position: absolute;
	/*bottom: 60px;*/
	top: 60%;
	right: 90px;
	overflow: hidden;
	animation: bannerNav 1.5s linear;
	-moz-animation: bannerNav 1.5s linear;
	-webkit-animation: bannerNav 1.5s linear;
	-o-animation: bannerNav 1.5s linear;
}
@media screen and (max-width:1300px){
	.banner.active .text{
		display: none;
	}
	.banner.active .banner-icon{
		display: none;
	}
}
@keyframes bannerNav
{
	0%{height: 0;}
	12.5% {height: 12.5%;}
	25% {height: 25%;}
	37.5% {height: 37.5%;}
	50% {height: 50%;}
	62.5% {height: 62.5%;}
	75% {height: 75%;}
	87.5% {height: 87.5%;}
	100% {height: auto;}
}

@-moz-keyframes bannerNav
{
	0%{height: 0;}
	12.5% {height: 12.5%;}
	25% {height: 25%;}
	37.5% {height: 37.5%;}
	50% {height: 50%;}
	62.5% {height: 62.5%;}
	75% {height: 75%;}
	87.5% {height: 87.5%;}
	100% {height: auto;}
}

@-webkit-keyframes bannerNav
{
	0%{height: 0;}
	12.5% {height: 12.5%;}
	25% {height: 25%;}
	37.5% {height: 37.5%;}
	50% {height: 50%;}
	62.5% {height: 62.5%;}
	75% {height: 75%;}
	87.5% {height: 87.5%;}
	100% {height: auto;}
}

@-o-keyframes bannerNav
{
	0%{height: 0;}
	12.5% {height: 12.5%;}
	25% {height: 25%;}
	37.5% {height: 37.5%;}
	50% {height: 50%;}
	62.5% {height: 62.5%;}
	75% {height: 75%;}
	87.5% {height: 87.5%;}
	100% {height: auto;}
}
.banner-nav-cont ul li{
	font-size: 16px;
	color: rgba(51,51,51,.75);
	line-height: 40px;
	cursor: pointer;
}
.banner-nav-cont ul li:nth-child(2){
	margin-left: 58px;
}
.banner-nav-cont ul li:nth-child(3){
	margin-left: 54px;
}
.banner-nav-cont ul li:nth-child(4){
	margin-left: 100px;
}
.banner-nav-cont ul li:nth-child(5){
	margin-left: 30px;
}
.banner-nav-cont ul li:nth-child(6){
	margin-left: 76px;
}
.banner-nav-cont ul li:nth-child(7){
	margin-left: 112px;
}
.banner-nav-cont ul li:nth-child(8){
	margin-left: 60px;
}
.banner-nav-cont ul li.active{
	color: rgba(141,14,84,.75);
}





.link-cont{
	font-size: 0;
	width: 96.8%;
	margin-left: calc(3.2% - 20px);
	margin-top: 40px;
	margin-bottom: 140px;
}
.link-cont .link{
	width: calc((100% - 9px) / 3);
	display: inline-block;
	position: relative;
	vertical-align: top;
}
.link-cont .link + .link{
	margin-left: 2px;
}
.link-cont .link a{
	display: block;
	width: 100%;
	height: 16.5vw;
	margin-bottom: 10px;
}
.link-cont .link a:hover + .cooperation-cont{
	display: block;
}
.link-cont .link.technology a{
	background: url(/resource/images/index/link-1.png) center center no-repeat;
	background-size: 100% 100%;
}
.link-cont .link.product a{
	background: url(/resource/images/index/link-2.png) center center no-repeat;
	background-size: 100% 100%;
}
.link-cont .link.platform a{
	background: url(/resource/images/index/link-3.png) center center no-repeat;
	background-size: 100% 100%;
}
.link-cont .link a .title{
	font-size: 26px;
	color: #fff;
	line-height: 34px;
	padding-top: 24px;
}
.link-cont .link a .text{
	font-size: 16px;
	color: #fff;
	line-height: 34px;
}
.link-cont .link a p{
	text-indent: 34px;
}
.link-cont .link .link-text{
	font-size: 18px;
	color: #666;
	line-height: 36px;
	padding-left: 35px;
}
.link-cont .link .link-text .red{
	color: #b81c22;
}
.cooperation-cont{
	left: 0;
	bottom: -58px;
	position: absolute;
	display: none;
	transition: opacity 1s;
	-moz-transition:  opacity 1s;	/* Firefox 4 */
	-webkit-transition:  opacity 1s;	/* Safari 和 Chrome */
	-o-transition:  opacity 1s;
	width: 100%;
}
.cooperation-cont ul li{
	display: inline-block;
	transform:translateY(-100px);
	opacity: 0;
	width: 9.6%;
}
.cooperation-cont ul li + li{
	margin-left: 4%;
}
.cooperation-technology-cont ul li:nth-child(1) {
	animation: cooperationIcon .3s linear  forwards;
	-moz-animation: cooperationIcon .3s linear  forwards;
	-webkit-animation: cooperationIcon .3s  linear  forwards;
	-o-animation: cooperationIcon .3s linear  forwards;
}
.cooperation-technology-cont ul li:nth-child(2) {
	animation: cooperationIcon .3s .3s linear  forwards;
	-moz-animation: cooperationIcon .3s .3s linear  forwards;
	-webkit-animation: cooperationIcon .3s .3s  linear  forwards;
	-o-animation: cooperationIcon .3s .3s linear  forwards;
}
.cooperation-technology-cont ul li:nth-child(3) {
	animation: cooperationIcon .3s .6s linear  forwards;
	-moz-animation: cooperationIcon .3s .6s linear  forwards;
	-webkit-animation: cooperationIcon .3s  .6s linear  forwards;
	-o-animation: cooperationIcon .3s .6s linear  forwards;
}
.cooperation-technology-cont ul li:nth-child(4) {
	animation: cooperationIcon .3s .9s linear  forwards;
	-moz-animation: cooperationIcon .3s .9s linear  forwards;
	-webkit-animation: cooperationIcon .3s .9s linear  forwards;
	-o-animation: cooperationIcon .3s .9s linear  forwards;
}
.cooperation-technology-cont ul li:nth-child(5) {
	animation: cooperationIcon .3s 1.2s linear  forwards;
	-moz-animation: cooperationIcon .3s 1.2s linear  forwards;
	-webkit-animation: cooperationIcon .3s 1.2s linear  forwards;
	-o-animation: cooperationIcon .3s 1.2s linear  forwards;
}
.cooperation-technology-cont ul li:nth-child(6) {
	animation: cooperationIcon .3s 1.5s linear  forwards;
	-moz-animation: cooperationIcon .3s 1.5s linear  forwards;
	-webkit-animation: cooperationIcon .3s 1.5s linear  forwards;
	-o-animation: cooperationIcon .3s 1.5s linear  forwards;
}
.cooperation-technology-cont ul li:nth-child(7) {
	animation: cooperationIcon .3s 1.8s linear  forwards;
	-moz-animation: cooperationIcon .3s 1.8s linear  forwards;
	-webkit-animation: cooperationIcon .3s 1.8s linear  forwards;
	-o-animation: cooperationIcon .3s 1.8s linear  forwards;
}
@keyframes cooperationIcon
{
	from {transform:translateY(-30px);opacity: 0;}
	to {transform:translateY(0);opacity: 1;}
}
@-moz-keyframes cooperationIcon
{
	from {transform:translateY(-30px);opacity: 0;}
	to {transform:translateY(0);opacity: 1;}
}

@-webkit-keyframes cooperationIcon
{
	from {transform:translateY(-30px);opacity: 0;}
	to {transform:translateY(0);opacity: 1;}
}

@-o-keyframes cooperationIcon
{
	from {transform:translateY(-30px);opacity: 0;}
	to {transform:translateY(0);opacity: 1;}
}
@media screen and (max-width:920px){
	.link-cont .link .link-text{
		font-size: 14px;
		line-height: 24px;
	}
	.link-cont .link a .title{
		font-size: 20px;
	}
	.link-cont .link a .text{
		font-size: 14px;
	}
	.banner.active .title{
		font-size: 20px;
	}
	.s-right .s-1-cont{
		left: 12%;
	}
	.c-right .c-1-cont{
		top: 25%;
	}
	.link-cont .link a .title{
		font-size: 14px;
		line-height: 24px;
	}
	.link-cont .link a .text{
		font-size: 12px;
		line-height: 20px;
	}
	.link-cont .link a:hover + .cooperation-cont{
		display: none;
	}
}








/*另外一个banner*/
.swiper-container {
	width: 100%;
	height: 100%;
}
.swiper-wrapper{
	width: 100%;
	height: 100%;
}
.swiper-container .swiper-slide{
	position: relative;
	overflow: hidden;
}
.swiper-container .swiper-slide img{
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
}
.swiper-container .swiper-slide .banner1-1{
	z-index: 2;
}
.swiper-container .swiper-slide .banner1-3{
	z-index: 2;
}
.swiper-container .swiper-slide .banner1-4{
	z-index: 2;
}
.swiper-container .swiper-slide.swiper-slide-active .banner1-1{
	animation: banner1Img 2s linear infinite alternate;
	-moz-animation: banner1Img 2s linear infinite alternate;
	-webkit-animation: banner1Img 2s linear infinite alternate;
	-o-animation: banner1Img 2s linear infinite alternate;
}
.swiper-container .swiper-slide.swiper-slide-active .banner1-4{
	opacity: 0;
	animation: banner1Img 2s 2s linear infinite alternate;
	-moz-animation: banner1Img 2s 2s linear infinite alternate;
	-webkit-animation: banner1Img 2s 2s linear infinite alternate;
	-o-animation: banner1Img 2s 2s linear infinite alternate;
}
@keyframes banner1Img
{
	0%{opacity: 0;}
	50% {opacity: 1;}
	100% {opacity: 1;}
}
.swiper-container .swiper-slide .banner1-text-cont{
	position: absolute;
	left: 8%;
	top: 27%;
	/*right: 80px;*/
	/*bottom: 30px;*/
	width: 32.8%;
	z-index: 999;
}
.swiper-container .swiper-slide .banner1-text-cont .title{
	font-size: 48px;
	font-weight: 700;
	color: #fff;
	line-height: 80px;
}
.swiper-container .swiper-slide .banner1-text-cont .text{
	font-size: 18px;
	color: #fff;
	line-height: 40px;
}


.swiper-container .swiper-slide .banner2{
	left: 0;
	animation: banner2 5s linear infinite ;
	-moz-animation: banner2 5s linear infinite ;
	-webkit-animation: banner2 5s linear infinite ;
	-o-animation: banner2 5s linear infinite ;
}
@keyframes banner2
{
	0% {left: 0}
	100% {left: -106.719%}
}
.swiper-container .swiper-slide .small-cont{
	position: absolute;
	/*left: 100px;
	bottom: 250px;
	height: 150px;
	width: 744px*/
	left: 10%;
	bottom: 40%;
	width: 38.75%;
	height: 18.75%;
;
}
.swiper-container .swiper-slide .small-cont .clip-cont{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 3;
	background-color: rgba(0,0,0,.3);
	box-shadow: 0 0 20px #000;
	overflow: hidden;
}
.swiper-container .swiper-slide .small-cont .clip-cont  .line{
	border-top: 2px solid #ffff00;
	position: absolute;
	top: calc(50% - 1px);
	width: 94%;
	left: 3%;
	z-index: 4;
}
.swiper-container .swiper-slide .small-cont .clip-cont .clip{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	overflow: hidden;
	animation: clip1 5s linear infinite ;
	-moz-animation: clip1 5s linear infinite ;
	-webkit-animation: clip1 5s linear infinite ;
	-o-animation: clip1 5s linear infinite ;
}
@keyframes clip1
{
	0% {width: 4vw}
	100% {width: calc(100% - 4px)}
}
.swiper-container .swiper-slide .small-cont .clip-cont .clip .clip-rectangle{
	position: absolute;
	top: 0;
	right: 0;
	width: 4vw;
	z-index: 9;
	height: calc(100% - 4px);
	border: 2px solid rgba(0,0,0,.3);
	box-shadow: 0 0 5px #000;
	background-color: transparent;
}
.swiper-container .swiper-slide .small-cont .clip-cont .clip-arrow{
	position: absolute;
	left: 4.5vw;
	top: 33%;
	width: auto;
	height: 34%;
	z-index: 999;
	animation: clipArrow 5s linear infinite;
	-moz-animation: clipArrow 5s linear infinite;
	-webkit-animation: clipArrow 5s linear infinite;
	-o-animation: clipArrow 5s linear infinite;
}
@keyframes clipArrow
{
	0% {left: 4.5vw}
	100% {left: calc(100% - 2px)}
}
.swiper-container .swiper-slide .small-cont .clip-cont .clip img{
	height: 100%;
}
.swiper-container .swiper-slide .small-cont .clip-cont .clip-img{
	position: absolute;
	left: 0;
	z-index: 5;
}
.swiper-container .swiper-slide .banner2-text-cont{
	position: absolute;
	left: 8%;
	top: 27%;
	width: 41.7%;
	z-index: 999;
}
.swiper-container .swiper-slide .banner2-text-cont .title{
	font-size: 48px;
	font-weight: 700;
	color: #fff;
	line-height: 80px;
}
.swiper-container .swiper-slide .banner2-text-cont .text{
	font-size: 18px;
	color: #fff;
	line-height: 40px;
}

.swiper-container .swiper-slide .banner3-text-cont{
	position: absolute;
	left: 8%;
	top: 27%;
	/*right: 80px;*/
	/*bottom: 120px;*/
	width: 32.8%;
	z-index: 999;
}
.swiper-container .swiper-slide .banner3-text-cont .title{
	font-size: 48px;
	font-weight: 700;
	color: #fff;
	line-height: 80px;
}
.swiper-container .swiper-slide .banner3-text-cont .text{
	font-size: 18px;
	color: #fff;
	line-height: 40px;
}





.swiper-container .swiper-slide .scale-num{
	position: absolute;
	z-index: 99;
	display: block;
	width: 100px;
	border-bottom: 5px solid #f00;
	bottom: 30px;
	left: calc(50% - 50px);
	height: auto;
	text-align: center;
	color: #f00;
	font-weight: 700;
}
.swiper-container .swiper-slide .banner3{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
}
.swiper-pagination .swiper-pagination-bullet{
	display: inline-block;
	width: 80px;
	height: 3px;
	margin-right: 10px;
	background-color: #3a333f;
	position: relative;
	cursor: pointer;
	border-radius: 0;
	position: relative;
	opacity: 1;
}
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active:after{
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	height: 3px;
	width: 0;
	background-color: #918c94;
	animation: swiperBtn 9s linear forwards;
	-moz-animation: swiperBtn 9s linear forwards;
	-webkit-animation: swiperBtn 9s linear forwards;
	-o-animation: swiperBtn 9s linear forwards;
}
@keyframes swiperBtn
{
	0%{width: 0;}
	100% {width: 100%;}
}
@media screen and (max-width:1400px){
	.swiper-container .swiper-slide .banner-text-cont{
		width: 100%;
		left: 10%;
		bottom: 20%;
	}
	.banner-text-cont .text{
		display: none;
	}
}
@media screen and (max-width:730px){
	.link-cont{
		width: 94%;
		margin: 0 3%;
	}
	.link-cont .link{
		width: 100%;
		display: block;
		margin-top: 20px;
	}
	.link-cont .link a{
		height: 45vw;
	}
	.swiper-container .swiper-slide .banner-text-cont .title{
		font-size: 18px;
		line-height: 20px;
	}
	.swiper-pagination .swiper-pagination-bullet{
		width: 10%;
	}
}